<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>add Emp</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" type="text/css"
			href="css/style.css" />
	</head>

	<body>
		<div id="wrap">
			<div id="top_content">
					<div id="header">
						<div id="rightheader">
							<p>
								2009/11/20
								<br />
							</p>
						</div>
						<div id="topheader">
							<h1 id="title">
								<a href="#">Main</a>
							</h1>
						</div>
						<div id="navigation">
						</div>
					</div>
				<div id="content">
					<p id="whereami">
					</p>
					<h1>
						add Emp info:
					</h1>
					<form action="index.html" method="post">
						<table cellpadding="0" cellspacing="0" border="0"
							class="form_table">
							<tr>
								<td valign="middle" align="right">
									商品名称:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" v-model="goodinfo.gname" />
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									原价:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" v-model="goodinfo.goldprice" />
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									活动价:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" v-model="goodinfo.gnewprice" />
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									商品颜色:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" v-model="goodinfo.gcolor" />
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									商品版本:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" v-model="goodinfo.gedition" />
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									商品数量:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" v-model="goodinfo.gcount" />
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									商品类型:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" v-model="goodinfo.gpid" />
								</td>
							</tr>

							<tr>
								<td valign="middle" align="right">
									photo:
								</td>
								<td valign="middle" align="left">
									<input type="file" ref="myPhoto" name="file"/>
								</td>
							</tr>
						</table>
						<p>
							<input type="button" @click="saveEmp"  class="button" value="Confirm" />
						</p>
					</form>
				</div>
			</div>
			<div id="footer">
				<div id="footer_bg">
					ABC@126.com
				</div>
			</div>
		</div>
	</body>
</html>

<script type="text/javascript" src="js/vue.js"></script>
<script type="text/javascript" src="js/axios.min.js"></script>
<script>
    var app = new Vue({
        el: "#wrap",
        data: {
            goodinfo: {}
        },
        methods: {
            // 双向绑定
            saveEmp(){
                // 实例化一个form格式
	            let formdata = new FormData();
	            formdata.append("gname", this.goodinfo.gname);
                formdata.append("goldprice", this.goodinfo.goldprice);
                formdata.append("gnewprice", this.goodinfo.gnewprice);
                formdata.append("gcolor", this.goodinfo.gcolor);
                formdata.append("gedition", this.goodinfo.gedition);
                formdata.append("gcount", this.goodinfo.gcount);
                formdata.append("gpid", this.goodinfo.gpid);
                formdata.append("file", this.$refs.myPhoto.files[0]);
                let _that = this;
                axios({
	                method: "post",
	                data: formdata,
	                url: "http://localhost/huawei/goodinfos/addGoodinfos",
	                headers: {
	                    'content-type':'multipart/form-data'
	                }
                }).then(function (res){
                    console.log(res.data);
                    if (res.data.status){
                        if (window.confirm(res.data.msg+",点击跳转到列表页面")){
                            location.href="/huawei/index.html";
                        }else {
							_that.emp = {};
                        }
                    }else {
                        alert(res.data.msg);
                    }
                })
            }
        }
    });
</script>